<template>
  <view v-if="shenheStatus == 0" class="detail">
    <template v-if="data">
      <view class="price"
        >支付金额<view>¥ {{ data.pay_price }}</view></view
      >
      <view class="detailData">
        <view class="item">
          <view class="let">订单号：</view>
          <view class="rig">{{ data.order_no }}</view>
        </view>
        <view class="item">
          <view class="let">支付时间：</view>
          <view class="rig">{{
            $utils.formatDate(new Date(data.pay_time * 1000))
          }}</view>
        </view>
        <view class="item">
          <view class="let">赠送金额：</view>
          <view class="rig">{{
            parseFloat(data.send_price)
              ? "¥" + parseFloat(data.send_price)
              : "-"
          }}</view>
        </view>
        <view class="item">
          <view class="let">赠送{{ stores.integral_name }}：</view>
          <view class="rig">{{ parseInt(data.send_integral) || "-" }}</view>
        </view>
        <view class="item">
          <view class="let">支付类型：</view>
          <view class="rig">{{ payTypeWord(data.pay_type) }}</view>
        </view>
      </view>

      <view class="detailData" v-if="param">
        <view class="popTitle">售后记录</view>
        <view class="item">
          <view class="let">申请时间：</view>
          <view class="rig">{{
            $utils.formatDate(new Date(param.created_at * 1000))
          }}</view>
        </view>
        <view class="item">
          <view class="let">退款单号：</view>
          <view class="rig">{{ param.order_refund_no }}</view>
        </view>
        <view class="item">
          <view class="let">申请状态：</view>
          <view class="rig">{{
            auditStatusList[param.audit_status] || ""
          }}</view>
        </view>
        <view class="item">
          <view class="let">扣减余额：</view>
          <view class="rig">{{ param.sub_balance || "-" }}</view>
        </view>
        <view class="item">
          <view class="let">扣减{{ stores.integral_name }}：</view>
          <view class="rig">{{ param.sub_integral || "-" }}</view>
        </view>
        <view class="item">
          <view class="let">退款现金：</view>
          <view class="rig">{{ param.refund_price || "-" }}</view>
        </view>
        <view class="item">
          <view class="let">审核备注：</view>
          <view class="rig">{{ param.desc_admin || "-" }}</view>
        </view>
      </view>
      <view v-else class="btn" @click="show = true">申请退款</view>
    </template>

    <u-popup
      v-model="show"
      mode="bottom"
      safe-area-inset-bottom
      border-radius="12"
      z-index="9"
    >
      <view class="pop">
        <view class="popTitle">申请退款</view>
        <u-input v-model="desc_user" type="textarea" placeholder="请输入备注" />

        <view class="btn" @click="submit">提交</view>
      </view>
    </u-popup>
  </view>
  <Shenhe v-else-if="shenheStatus == 1"></Shenhe>
</template>

<script>
import Shenhe from "@/components/shenhe/shenhe";
export default {
  components: {
    Shenhe,
  },
  data() {
    return {
      data: null,
      show: false,
      desc_user: "",
      param: null,
      auditStatusList: {
        0: "待审核",
        1: "已通过",
        2: "已拒绝",
      },
    };
  },
  computed: {
    payTypeWord() {
      return (pay_type) => {
        const Pay_Trans = {
          1: this.$t("common.payMethod1"),
          2: this.$t("common.payMethod2"),
          3: this.$t("common.payMethod3"),
          4: this.$t("common.payMethod4"),
        };
        return Pay_Trans[pay_type] || null;
      };
    },
  },
  async onLoad(opi) {
    this.data = opi;

    const res = await this.$allrequest.user.rechargeOrderRefundMoneyList({
      order_id: opi.id,
    });

    if (!res.code && res.data && res.data.data && res.data.data.length) {
      let {
        created_at,
        order_refund_no,
        audit_status,
        sub_balance,
        sub_integral,
        refund_price,
        desc_admin,
      } = res.data.data[0];

      this.param = {
        created_at, // 申请时间
        order_refund_no, // 退款单号
        audit_status,
        sub_balance,
        sub_integral,
        refund_price,
        desc_admin,
      };
    }
  },

  methods: {
    async submit() {
      let { data, desc_user } = this,
        { id } = data;

      const res = await this.$allrequest.user.rechargeOrderRefundMoneyApply(
        {
          order_id: id,
          desc_user,
        },
        true
      );
      if (res.code === 0) {
        this.$utils.showModal("提示", res.msg, false, () => {
          uni.navigateBack();
        });
        return;
      }

      this.$utils.toast(res.msg);
    },
  },
};
</script>

<style lang="scss" scoped>
.detail {
  background: #f2f2f2;
  min-height: 100vh;
  padding: 0 20rpx;
}

.detailData {
  padding: 24rpx;
  border-radius: 20rpx;
  background: #fff;
}

.price {
  padding: 40rpx 0;
  text-align: center;
  font-size: 32rpx;

  view {
    display: block;
    font-size: 90rpx;
    font-weight: bold;
  }
}

.detailData {
  margin-bottom: 20rpx;
  .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10rpx 0;
    font-size: 30rpx;
  }
}

.btn {
  margin-top: 40rpx;
  height: 88rpx;
  line-height: 88rpx;
  background: #f0250e;
  color: #fff;
  border-radius: 32px;
  font-size: 32rpx;
  text-align: center;
}

.pop {
  padding: 20rpx;
}

.popTitle {
  padding-bottom: 20rpx;
  font-size: 34rpx;
  font-weight: bold;
}
</style>
